// 用户操作功能
document.addEventListener('DOMContentLoaded', function() {
    // 编辑用户按钮点击事件
    document.querySelectorAll('.edit-btn').forEach(btn => {
        btn.addEventListener('click', function() {
            const userItem = this.closest('.user-item');
            const username = userItem.querySelector('.username').textContent;
            const email = userItem.querySelector('.user-email').textContent;
            const role = userItem.querySelector('.role-badge').textContent;
            const status = userItem.querySelector('.status-badge').textContent;
            
            // 填充模态框表单
            document.getElementById('editUsername').value = username;
            document.getElementById('editEmail').value = email;
            document.getElementById('editRole').value = role.toLowerCase().replace('用户', '');
            document.getElementById('editStatus').value = status.toLowerCase().replace('已', '');
            
            // 显示模态框
            document.getElementById('editUserModal').style.display = 'flex';
        });
    });
    
    // 关闭模态框
    document.querySelector('.close-modal').addEventListener('click', function() {
        document.getElementById('editUserModal').style.display = 'none';
    });
    
    document.querySelector('.cancel-edit').addEventListener('click', function() {
        document.getElementById('editUserModal').style.display = 'none';
    });
    
    // 保存更改
    document.querySelector('.save-changes').addEventListener('click', function() {
        const form = document.getElementById('editUserForm');
        if (form.checkValidity()) {
            const username = document.getElementById('editUsername').value;
            const email = document.getElementById('editEmail').value;
            const role = document.getElementById('editRole').value;
            const status = document.getElementById('editStatus').value;
            
            // 在实际应用中，这里应该发送AJAX请求到服务器
            alert(`用户信息已更新:\n用户名: ${username}\n邮箱: ${email}\n角色: ${role}\n状态: ${status}`);
            
            // 关闭模态框
            document.getElementById('editUserModal').style.display = 'none';
        } else {
            alert('请填写所有必填字段');
        }
    });
    
    // 封禁/解封用户
    document.querySelectorAll('.ban-btn, .unban-btn').forEach(btn => {
        btn.addEventListener('click', function() {
            const userItem = this.closest('.user-item');
            const statusBadge = userItem.querySelector('.status-badge');
            const username = userItem.querySelector('.username').textContent;
            
            if (this.classList.contains('ban-btn')) {
                if (confirm(`确定要封禁用户 ${username} 吗？`)) {
                    statusBadge.className = 'status-badge status-banned';
                    statusBadge.textContent = '已封禁';
                    this.className = 'action-btn unban-btn';
                    this.textContent = '解封';
                    alert(`用户 ${username} 已被封禁`);
                }
            } else {
                if (confirm(`确定要解封用户 ${username} 吗？`)) {
                    statusBadge.className = 'status-badge status-active';
                    statusBadge.textContent = '正常';
                    this.className = 'action-btn ban-btn';
                    this.textContent = '封禁';
                    alert(`用户 ${username} 已解封`);
                }
            }
        });
    });
    
    // 验证用户
    document.querySelectorAll('.verify-btn').forEach(btn => {
        btn.addEventListener('click', function() {
            const userItem = this.closest('.user-item');
            const statusBadge = userItem.querySelector('.status-badge');
            const username = userItem.querySelector('.username').textContent;
            
            if (confirm(`确定要验证用户 ${username} 吗？`)) {
                statusBadge.className = 'status-badge status-active';
                statusBadge.textContent = '正常';
                this.className = 'action-btn ban-btn';
                this.textContent = '封禁';
                alert(`用户 ${username} 已验证`);
            }
        });
    });
    
    // 重置密码
    document.querySelectorAll('.reset-pwd').forEach(btn => {
        btn.addEventListener('click', function() {
            const userItem = this.closest('.user-item');
            const username = userItem.querySelector('.username').textContent;
            
            if (confirm(`确定要重置用户 ${username} 的密码吗？`)) {
                const newPassword = Math.random().toString(36).slice(-8);
                alert(`用户 ${username} 的密码已重置为: ${newPassword}\n请通知用户及时修改密码`);
            }
        });
    });
    
    // 分页功能
    document.querySelectorAll('.pagination button:not(:disabled)').forEach(btn => {
        btn.addEventListener('click', function() {
            if (!this.classList.contains('active')) {
                document.querySelector('.pagination .active').classList.remove('active');
                this.classList.add('active');
                alert('切换到第 ' + this.textContent + ' 页');
            }
        });
    });
    
    // 点击模态框外部关闭模态框
    window.addEventListener('click', function(event) {
        const modal = document.getElementById('editUserModal');
        if (event.target === modal) {
            modal.style.display = 'none';
        }
    });
});